<div id="top-menu-bar">
  <div id="top-menu-bar-left">
    {% include "../assets/logo.html" %}
    <h2>&nbsp; AppFlowy Cloud &nbsp;</h2>

    <div
      hx-target="#sidebar-content"
      hx-get="../web/components/user/user"
      class="button cyan"
    >
      {{ user.email|escape }}
    </div>
    <div
      hx-delete="../web-api/delete-account"
      hx-confirm="This will erase all data associated with this account. Are you sure?"
      class="button red"
    >
      Delete Account
    </div>
  </div>

  <div id="top-menu-bar-right">
    <!-- prettier-ignore -->
    {% if is_admin %}
    <div id="adminBtn" class="button red">Admin</div>
    <script>
      document
        .getElementById("adminBtn")
        .addEventListener("click", function () {
          window.location.href = "../web/admin/home";
        });
    </script>
    {% endif %}

    <div class="button yellow" id="logoutBtn" hx-post="../web-api/logout">
      Logout
    </div>
  </div>
</div>
